<template>
  <div class="update-password-form">
    <el-form ref="form" :model="form" label-width="120px">
      <el-form-item label="当前密码" prop="password" required>
        <el-input type="password" v-model="form.password" placeholder="请输入当前密码"></el-input>
      </el-form-item>

      <el-form-item label="新密码" prop="newPassword" required>
        <el-input type="password" v-model="form.newPassword" placeholder="请输入新密码"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="submitUpdatePassword">修改密码</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
// 引入封装好的 API 方法
import { updatePw } from '@/api/system/user';

export default {
  data() {
    return {
      form: {
        password: '',
        newPassword: ''
      }
    };
  },
  methods: {
    submitUpdatePassword() {
      // 表单校验（可以自定义规则）
      if (!this.form.password || !this.form.newPassword) {
        this.$message.error("请填写所有必填项");
        return;
      }

      // 调用封装的 API 函数
      updatePw(this.form)
          .then(response => {
            const resData = response; // 直接获取响应对象
            console.log(resData);

            if (resData.code === 200) {
              this.$message.success(resData.message || '密码修改成功');

              // 清空 token
              localStorage.removeItem('token');  // 或 sessionStorage.removeItem('token')，看你的 token 存储在哪里

              // 跳转到登录页面
              this.$router.push('/login');  // 跳转到登录页面

            } else {
              this.$message.error(resData.message || '密码修改失败');
            }
          })
          .catch(error => {
            console.error(error);
            this.$message.error('修改密码时出现错误');
          });
    }
  }
};
</script>
